<!DOCTYPE html>
<html>
<head>
    <title>随拍</title>
    <meta charset="utf-8">
    <script type="text/javascript" src="jquery-3.4.1.js"></script>
    <link href="../css/mb.css" rel="stylesheet" media="all" />
    <link href="../css/发现.css" rel="stylesheet" media="all" />
    <script>
        $(document).ready(function(){
        });
    </script>
</head>

<body>
    <div class="zy">
        <div class="top">
            <div class="lg">S</div>
            <nav>
                <ul class="main">
                    <li>
                        <a class="logo"></a>
                    </li>
                    <li>
                        <a href="main.html" style="font-size: 20px;font-weight: 600;letter-spacing: 1.2px;margin-top: 8px;">随拍</a>
                    </li>
                    <li><a href="main.html" class="top_menu">首页</a></li>
                    <li><a href="findProject1.html" class="top_menu">项目</a></li>
                    <li><a href="discover.html" class="top_menu">发现</a></li>
                    <li  class="box" >
                        <a class="dl" href="#"></a>
                        <ul class="drop menu2">
                                <li><a class="aaa" href="#">账号安全</a></li>
                                <li><a href="#">2</a></li>
                                <li><a href="#">3</a></li>
                                <li><a class="aa" href="#">退出登录</a></li>
                        </ul>
                      </li>
                </ul>
            </nav>
        </div>
    </div>
    <div class="content">
        <div class="choose">
                <ul>
                    <li><a href="http://www.baidu.com">广告</a></li>
                    <li><a href="http://www.baidu.com">剧情短片</a></li>		
                    <li><a href="http://www.baidu.com">宣传片</a></li>
                    <li><a href="http://www.baidu.com">创意</a></li>
                    <li><a href="http://www.baidu.com">特摄</a></li>
                    <li><a href="http://www.baidu.com">旅拍</a></li>
                    <li><a href="http://www.baidu.com">影视</a></li>
                    <li><a href="http://www.baidu.com">混剪</a></li>
                    <li><a href="http://www.baidu.com">器材</a></li>
                    <li><a href="http://www.baidu.com">干货教程</a></li>
                    <li><a href="http://www.baidu.com">VLOG</a></li>
                    <li><a href="http://www.baidu.com">古风</a></li>
                    <li><a href="http://www.baidu.com">短视频</a></li>
                </ul>
		</div>
        <div class="mid">

        
        <div style="display: flex;justify-content: space-between;flex-wrap: wrap;"  >

       
        <% for( let i = 0; i < works.length; i++ ) { %>
        <div class="mv">
            <div class="video_img" style=<%= "background-image:url('/img/workPic/" + works[i].workPic + "')"%>>
                
                <div class="mask"><%= works[i].workInfo%></div>
                <div class="time">
                    <p>24:24</p>
                </div>
            </div>
            <div class="name"><%= works[i].workName%></div>
            <div class="type"><%= works[i].workType%></div>
            <div class="play">
                <div class="view">
                    <div class="view_img"></div>
                    <div class="view_num">12.2w</div>
                </div>
                <div class="like">
                    <div class="like_img"></div>
                    <div class="like_num">1070</div>
                </div>
            </div>
            <div class="author">
                <div class="author_img"></div>
                <div class="author_name"><%= works[i].userName%></div>
            </div>
        </div>
        <% } %>

    </div>
</div>
</div>
    <div class="pages">
        <div class="page">1</div>
        <div class="page">2</div>
        <div class="page">3</div>
        <div class="page">4</div>
        <div class="page">5</div>
        <div class="page">6</div>  
        <div class="page">...</div>

    </div>
    <div class="foot"></div>
</body>

</html>